/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

/**
 * 常用工具 => 大额提现申请
 */
import React, { useState } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Tabs } from 'antd';
import AmountApplyRecord from '@/components/_pages/AmountApply/record';
import DragTable from '@/components/DragTable';
import ApplyForm from '@/components/_pages/AmountApply/applyForm';
import type { StringObjType } from '@/components/_pages/AmountApply/index.d';
import { usePageTabsChange } from '@/utils/hooks/pageTabs';

const AmountApply: React.FC = () => {
  const [show] = usePageTabsChange();
  const [activeKey, setActiveKey] = useState<string>('upload');
  const [renewalApplyInfo, setRenewalApplyInfo] = useState<StringObjType>({});

  const renewalApply = (data: StringObjType) => {
    setRenewalApplyInfo(data);
    setActiveKey('upload');
  };

  const tabList = [
    {
      tab: '上传申请提现材料',
      key: 'upload',
      children: <ApplyForm renewalApply={renewalApply} renewalApplyInfo={renewalApplyInfo} />,
    },
    {
      tab: '申请记录',
      key: 'record',
      children: (
        <AmountApplyRecord renewalApply={renewalApply} isShow={activeKey == 'record'} show={show} />
      ),
    },
  ];

  return (
    <PageContainer style={{ background: '#fff' }}>
      <DragTable>
        <Tabs onChange={setActiveKey} activeKey={activeKey}>
          {tabList.map((item) => (
            <Tabs.TabPane tab={item.tab} key={item.key}>
              {item.children}
            </Tabs.TabPane>
          ))}
        </Tabs>
      </DragTable>
    </PageContainer>
  );
};

export default AmountApply;
